import 'package:flutter/material.dart';

void main() => runApp(ParentWidgetState());

class ParentWidgetState extends StatefulWidget {


  @override
  State createState() => _ParentWidgetState();
}

class _ParentWidgetState extends State<ParentWidgetState>{
  bool _active = false;

  void _handleTapBoxChanged(bool newValue) {
    setState(() => _active = newValue);
  }

  @override
  Widget build(BuildContext context) {
     return MaterialApp(
       home: Container(
         child: TapBoxB(
           active:_active,
           onChanged:_handleTapBoxChanged,

         ),
       ),
     );
  }
}

class TapBoxB extends StatelessWidget{

  const TapBoxB({Key? key, this.active: false, required this.onChanged})
    :super(key:key);

  final bool active;
  final ValueChanged<bool> onChanged;

  void _handleTap() {
    onChanged(!active);
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: _handleTap,
      child: Container(
        width: 200.0,
        height: 200.0,
        decoration: BoxDecoration(
          color: active ? Colors.lightGreen[700] : Colors.grey[600],
        ),
        child: Center(
          child: Text(
            active ? 'Active' : 'Inactive',
            style: const TextStyle(fontSize: 32.0, color: Colors.white, decoration: TextDecoration.none),
          ),
        ),
      ),
    );
  }
}
